<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="layout.xhtml">
        <ui:define name="body">

            <h:form id="registrationForm" enctype="multipart/form-data">
                <br/>
                <div style="float: left;width: 100%">
                    <h3 class="title" style="float: left">Averbação de Desmembramento</h3>
                    <p:commandButton value="Novo Imóvel" icon="ui-icon-plus" update="dlgImovel"  process="@this" style="float: right;margin-right: 15px" oncomplete="dlgImovel.show()" />
                </div>
                <p:growl id="messages" showDetail="true" autoUpdate="true"  /> 
                <div class="row">
                    <div class="twelve columns"> 
                        <p:panel id="panel" style="background: none; border: none;" 
                                 styleClass="container_24 clearfix ">

                            <p:dataTable id="tableImoveis" var="item" value="#{managerRegistration.imoveis}" 
                                         styleClass="grid_24" emptyMessage="Nenhum registro">  
                                <f:facet name="header">
                                    Imóveis
                                </f:facet>
                                <p:column headerText="Remover">
                                    <p:commandButton rendered="#{item ne managerRegistration.mainImovel}"  styleClass="optionButton" alt="Remover"
                                                     process="@this" icon="ui-icon-trash"
                                                     update="tableImoveis"
                                                     actionListener="#{managerRegistration.removeImovel(item)}" />

                                </p:column>

                                <p:column headerText="Localização">  
                                    <ui:repeat value="#{item.enderecoImovel}" var="i">
                                        <h:outputText value="Logradouro #{i.logradouro}, bairro #{i.bairro} "/>
                                    </ui:repeat>
                                </p:column>
                                <p:column headerText="Proprietário" width="300">  
                                    <p:outputLabel value="#{managerRegistration.nomeDosProprietarios(item)}" />
                                </p:column> 
                                <p:column headerText="Área" width="100">  
                                    <p:outputLabel value="#{item.dimensoes.areaTerreno}" />  
                                </p:column> 
                            </p:dataTable>   


                            <!--                                Adicionar Imovel-->
                            <p:dialog widgetVar="dlgImovel" id="dlgImovel" modal="true" header="Novo Imóvel" height="510" 
                                      width="960">
                                <p:panel id="personPanel" style="background: none; border: none;" 
                                         styleClass="container_24 clearfix both ">

                                    <h4 class="title">Dimensões da Unidade</h4>

                                    <p:panel id="dimenPanel" style="background: none; border: none;" 
                                             styleClass="container_24 clearfix"> 
                                        <h5 class="title">Dimensões e Confrontações</h5>
                                        <br/>
                                        <h5 class="title">Frente</h5>
                                        <p:outputLabel value="Para:" styleClass="grid_3" for="frenteInputText" />
                                        <p:inputText id="frenteInputText" styleClass="grid_10"
                                                     value="#{managerRegistration.newImovel.frente}" />
                                        <div class="clear"/>
                                        <p:outputLabel value="Rua:" styleClass="grid_3" for="frenteRuaInputText" />
                                        <p:inputText id="frenteRuaInputText" styleClass="grid_10"
                                                     value="#{managerRegistration.newImovel.frenteRua}" />
                                        <div class="clear"/>
                                        <p:outputLabel value="Medindo:" styleClass="grid_3" for="frenteMedInputText" />
                                        <p:inputText id="frenteMedInputText" styleClass="grid_10"
                                                     value="#{managerRegistration.newImovel.frenteMedindo}" />
                                        <div class="clear"/>
                                        <h5 class="title">Lado Direito</h5>

                                        <p:outputLabel value="Para:" styleClass="grid_3" for="direitoParaInputText" />
                                        <p:inputText id="direitoParaInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.ladoDireito}" />
                                        <div class="clear"/>

                                        <p:outputLabel value="Rua:" styleClass="grid_3" for="direitoRuaInputText" />
                                        <p:inputText id="direitoRuaInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.ladoDireitoRua}" />
                                        <div class="clear"/>

                                        <p:outputLabel value="Medindo:" styleClass="grid_3" for="direitoMedInputText" />
                                        <p:inputText id="direitoMedInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.ladoDireitoMedindo}" />
                                        <div class="clear"/>
                                        <h5 class="title">Lado Esquerdo</h5>
                                        <p:outputLabel value="Para:" styleClass="grid_3" for="esquerdoInputText" />
                                        <p:inputText id="esquerdoInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.ladoEsquerdo}" />
                                        <div class="clear"/>

                                        <p:outputLabel value="Rua:" styleClass="grid_3" for="esquerdoRuaInputText" />
                                        <p:inputText id="esquerdoRuaInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.ladoEsquerdoRua}" />
                                        <div class="clear"/>

                                        <p:outputLabel value="Medindo:" styleClass="grid_3" for="esquerdoMedInputText" />
                                        <p:inputText id="esquerdoMedInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.ladoEsquerdoMedindo}" />
                                        <div class="clear"/>

                                        <h5 class="title">Fundo</h5>


                                        <p:outputLabel value="Para:" styleClass="grid_3" for="fundoInputText" />
                                        <p:inputText id="fundoInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.fundo}" />
                                        <div class="clear"/>
                                        <p:outputLabel value="Rua:" styleClass="grid_3" for="fundoRuaInputText" />
                                        <p:inputText id="fundoRuaInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.fundoRua}" />
                                        <div class="clear"/>
                                        <p:outputLabel value="Medindo:" styleClass="grid_3" for="fundoMedInputText" />
                                        <p:inputText id="fundoMedInputText" styleClass="grid_18" 
                                                     value="#{managerRegistration.newImovel.fundoMedindo}" />
                                        <div class="clear"/>
                                        <br/>

                                        <h5 class="title">Dimensões Terreno</h5>
                                        <br/>
                                        <p:outputLabel value="Área Terreno:" styleClass="grid_3" for="areaInputText" />
                                        <p:inputText id="areaInputText" styleClass="grid_4" 
                                                     value="#{managerRegistration.newImovel.dimensoes.areaTerreno}"
                                                     onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ','} );">
                                            <f:convertNumber pattern="#,###,##0.00"/>
                                            <!--                                    <p:ajax event="change" update="areaTerrenoTaxaInputText" />-->
                                        </p:inputText>

                                        <div class="clear"/>
                                        <p:outputLabel value="Área Unidade:" styleClass="grid_3" for="areaUInputText" />
                                        <p:inputText id="areaUInputText" styleClass="grid_4"
                                                     value="#{managerRegistration.newImovel.dimensoes.areaUnidade}"
                                                     onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ','} );">
                                            <f:convertNumber pattern="#,###,##0.00"/>
                                            <!--<p:ajax event="change" update="areaUnidadeTaxaInputText" />-->
                                        </p:inputText>

                                        <div class="clear"/>
                                        <p:outputLabel value="Área Total:" styleClass="grid_3" for="areaTInputText" />
                                        <p:inputText id="areaTInputText" styleClass="grid_4"
                                                     value="#{managerRegistration.newImovel.dimensoes.areaTotalEdificacao}"
                                                     onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ','} );">
                                            <f:convertNumber pattern="#,###,##0.00"/>
                                            <!--<p:ajax event="change" update="areaTotalTaxaInputText" />-->
                                        </p:inputText>

                                        <div class="clear"/>
                                        <p:outputLabel value="N˚Pavimento:" styleClass="grid_3" for="areaPInputText" />
                                        <p:inputText id="areaPInputText" styleClass="grid_2"
                                                     value="#{managerRegistration.newImovel.dimensoes.numPavimentacaoEdific}">
                                            <!--<p:ajax event="change" update="nPavimentoInputText" />-->
                                        </p:inputText>
                                        <div class="clear"/>
                                        <br/>

                                        <div class="clear"/>
                                        <h5 class="title">Testada</h5>
                                        <br/>
                                        <p:outputLabel value="Testada do Imóvel:" style="width: 20%" styleClass="grid_3" for="areaTiInputText" />
                                        <p:inputText id="areaTiInputText" styleClass="grid_4"
                                                     value="#{managerRegistration.newImovel.dimensoes.testadaImovel}"
                                                     onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ','} );">
                                            <f:convertNumber pattern="#,###,##0.00"/>
                                        </p:inputText>

                                        <p:outputLabel value="Servida Conservação Calçamento:" style="width: 30%" styleClass="grid_3" for="areaTSInputText" />
                                        <p:inputText id="areaTSInputText" styleClass="grid_4"
                                                     value="#{managerRegistration.newImovel.dimensoes.testadaServidaConservCalcamento}"
                                                     onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ','} );">
                                            <f:convertNumber pattern="#,###,##0.00"/>
                                        </p:inputText>

                                        <div class="clear"/>
                                        <p:outputLabel value="Servida Iluminação Pública:" style="width: 20%" styleClass="grid_3" for="areaTIInputText" />
                                        <p:inputText id="areaTIInputText" styleClass="grid_4"
                                                     value="#{managerRegistration.newImovel.dimensoes.testadaServidaPorIluminacaoPublica}"
                                                     onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ','} );">
                                            <f:convertNumber pattern="#,###,##0.00"/>
                                        </p:inputText>

                                        <p:outputLabel value="Servida Limpeza Pública:" style="width: 30%" styleClass="grid_3" for="areaTLInputText" />
                                        <p:inputText id="areaTLInputText" styleClass="grid_4"
                                                     value="#{managerRegistration.newImovel.dimensoes.testadaServidaLimpezaPublica}"
                                                     onkeypress="jQuery(this).autoNumeric({aSep: '.', aDec: ','} );">
                                            <f:convertNumber pattern="#,###,##0.00"/>
                                        </p:inputText>

                                    </p:panel>

                                </p:panel>
                                <div class="buttonAction">
                                    <p:commandButton value="Adicionar" icon="ui-icon-circle-plus"
                                                     actionListener="#{managerRegistration.addImovel()}"
                                                     oncomplete="dlgImovel.hide()"
                                                     update=":registrationForm:tableImoveis"
                                                     styleClass="ui-priority-primary" />
                                    <!--                                                         update="tableProprietario, :registrationForm:dlgProprietario"-->


                                    <p:commandButton process="@this" onclick="dlgImovel.hide()" value="Cancelar"  icon="ui-icon-trash" />
                                </div >


                            </p:dialog>


                            <div class="buttonAction">
                                <p:commandButton value="Salvar" icon="ui-icon-disk" 
                                                 actionListener="#{managerRegistration.salvarAverbacaoDesmembramento()}"
                                                 update="@form" process="@this"
                                                 tyleClass="ui-priority-primary" />

                                <p:button  href="pesquisarimovel.xhtml" process="@this" value="Cancelar"   icon="ui-icon-trash" />
                            </div >

                        </p:panel>
                        <br/>
                    </div>
                </div>
            </h:form>
        </ui:define>
    </ui:composition>

</html>
